<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>精品课</title>
		<meta id="viewport" name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=0" />
        <meta name="format-detection" content="telephone=no" />
        <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
        <link rel="stylesheet" type="text/css" href="css/aui.css"/>
	</head>
	<body style="background-color: #fff">
         <div class="scrollload-containernew">
	         <div id="content" class="scrollload-contentnew" style="overflow: hidden;"></div>
	     </div>
    </body>
    <script id="course_item" type="text/html">
    	    {{each courseArr}}
    	       <div onclick="goTOThemeDetail({{$value.themeid}})" class="course_bigView" style="margin: 2.5rem 1.5rem; min-height: 27.5rem;background-color: white;box-shadow: 0 0 0.52rem 0.52rem #eff0f5;border-radius: 0.5rem;">
					<img src="{{$value.bigimg | addUrl}}" style="width:100%; height: 15.2rem;" />
					<p style="margin-left: 1.0rem; margin-top: 1.5rem;margin-bottom: 0; color: #333333;font-size: 1.6rem;font-weight: bold;">{{$value.title}}</p>
					{{if userVip.type==1}}
					<p style="margin-left: 1.0rem; margin-top: .6rem;color: #ed8434;font-size: 1.4rem;font-weight: bold;">VIP ¥0 <span style="color: #999999;font-size: 1.2rem;"><s>{{"¥ " + $value.price}}</s></span></p>
					{{else if $value.isorder==1}}
					<p style="margin-left: 1.0rem; margin-top: .6rem;color: #ed8434;font-size: 1.4rem;font-weight: bold;">已购买</p>
					{{else}}
					<p style="margin-left: 1.0rem; margin-top: .6rem;color: #ed8434;font-size: 1.4rem;font-weight: bold;">{{"¥ " + $value.price + " "}}<span style="color: #999999;font-size: 1.2rem;"><s>{{"¥ " + $value.original_price}}</s></span></p>
					{{/if}}
				    <p style="margin-left: 1.0rem; margin-top: .6rem;margin-bottom: 0;color: #999999;font-size: 1.2rem;">{{$value.book_count + "节课 | " + $value.virtual_click_count + "人在学"}} </p>
				    
				    <p style="right:2.5rem;position: absolute; width: 7.8rem;height:3rem;margin-top: -2.3rem;background-image: linear-gradient(-179deg, #F7BA64 0%, #fbd454 100%);border-radius: 100px;text-align: center;color: #333333;font-size:1.3rem; line-height: 3.15rem; font-weight: bold;">
						立即学习
					</p>
			</div>
    	    {{/each}}
    </script>
    <script src="js/out7.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/aui-toast.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/zepto.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/md5.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/art-template.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/wxrem.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
		document.writeln("<script type=\"text/javascript\" src=\"js/common.js?"+ Math.random() + "\"></scr"+"ipt>");
    </script>
    <script type="text/javascript">
    	    var toast = new auiToast();
	    var page;
	    var courseArr = new Array();
	    //设置导入模板变变量
	    var imgHosturl = "http://img.readerday.com/cover/";
	    template.defaults.imports.addUrl = function(value){
		    if(value==""){
			    return "img/book.png"
		    }else{
			    return imgHosturl+value
		    }
	    };
	    function goTOThemeDetail(id){
		window.location.href = "themeDetail.html?themeId="+id;
	   }
	    var refreshUpOrDown = function(){
		var themeList_refresh = new Scrollload({
    	    container: document.querySelector('.scrollload-containernew'),
		content: document.querySelector('.scrollload-contentnew'),
		noMoreDataHtml : '<div id="slogen" align="center" class="col-xs-12" style="padding-bottom: 3.75rem;padding-top:2rem;height: 1.17rem; width:92%;font-size:1.4rem;left:4%">'+
			              slogenFont[rand(0,slogenFont.length)]+
						  '</div>',
        loadMore:function(sl){//上拉加载
        	    
        	    if (page >= 2) {
        	    	   getThemeListUp(sl);
        	    }
        },
        enablePullRefresh: true,
        pullRefresh:function(refreshDown){//下拉刷新
        	   getThemeListDown(refreshDown);
        	   refreshDown.refreshComplete()
        }
    });
	}
	
    var getThemeListUp = function(sl){//上拉加载
    	   $.ajax({
			type:"get",
			url:ascli(hostUrl+"product/theme/list?token="+token) + "&type=0&rows=10&page=" + page,
			async:true,
			success:function(data){
				if (data.status != 0 || !data.data.list.length) {
					if (sl) {
						sl.noMoreData()
					}
					return;
				}
				page ++;
				data.userVip=userVip
				courseArr = courseArr.concat(data.data.book_list);
				data.courseArr = courseArr;
				var course_item = template("course_item",data);
				document.getElementById('content').innerHTML = course_item;
				if (sl) {
					sl.unLock()
				}
			}
		});
    }
    
    var getThemeListDown = function(refreshDown){//下拉刷新
    	   
    	   $.ajax({//页面统计
				type:"get",
				url:hostUrl + "statistics/page?type=8&channel=weixin&unionid=" + unionid,
				async:true
			});
    	   
    	   toast.loading({
			title: "加载中",
			duration: 2000
		});
    	
    	   $.ajax({
			type:"get",
			url:ascli(hostUrl+"product/theme/list?token="+token) + "&type=0&rows=10&page=1",
			async:true,
			success:function(data){
				toast.hide();
				if (data.status != 0) {
					return;
				}
				page = 2;
				data.userVip=userVip
				courseArr = data.data.list;
				data.courseArr = courseArr;
				var course_item = template("course_item",data);
				document.getElementById('content').innerHTML = course_item;
				if (refreshDown) {
					refreshDown.refreshData();
					refreshDown.unLock()
				}else{
					refreshUpOrDown();
				}
			}
		});
    }
    getToken(getThemeListDown);
    </script>
</html>
